import 'package:flutter/material.dart';

import 'package:dio/dio.dart';
import '../../config/Config.dart';

// 消息弹框
import 'package:fluttertoast/fluttertoast.dart';

import '../../services/ScreenAdapter.dart';
import '../../widget/MyButton.dart';

class RegisterFirstPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => RegisterFirstState();
}

class RegisterFirstState extends State {
  String tel='';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('手机快速注册-第一步')),
      body: Container(
        padding: EdgeInsets.all(20),
        child: ListView(
          children: [
            // 输入手机
            Container(
              height: ScreenAdapter.height(110),
              margin: EdgeInsets.only(bottom: 20),
              decoration:
                  BoxDecoration(border: Border.all(color: Colors.black12)),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Container(
                    width: ScreenAdapter.width(140),
                    alignment: Alignment.center,
                    child: DropdownButton(
                      underline: Container(height: 0),
                      items: [
                        DropdownMenuItem(child: Text('+86'), value: 1),
                        DropdownMenuItem(child: Text('+12'), value: 2),
                        DropdownMenuItem(child: Text('+34'), value: 3),
                      ],
                      value: 1,
                      onChanged: (value) {},
                    ),
                  ),
                  Expanded(
                    flex: 1,
                    child: TextField(
                      decoration: InputDecoration(
                        hintText: '请输入手机号',
                        hintStyle: TextStyle(
                          fontSize: 14,
                        ),
                        border: OutlineInputBorder(
                          borderSide: BorderSide.none,
                        ),
                      ),
                      onChanged: (value) {
                        this.setState(() {
                          this.tel = value;
                        });
                      },
                    ),
                  ),
                ],
              ),
            ),

            SizedBox(height: 20),

            // 下一步
            MyButton(
              text: '下一步',
              color: Colors.black12,
              height: ScreenAdapter.height(180),
              textColor: Colors.black54,
              leftMargin: 0,
              rightMargin: 0,
              borderRadius: 0,
              cb: _sendCode,
            ),

            SizedBox(height: 20),
            Row(
              children: [
                Text('遇到问题？您可以', style: TextStyle(color: Colors.black54)),
                Text('联系客服',
                    style: TextStyle(
                      color: Colors.black87,
                      fontSize: 12,
                      decoration: TextDecoration.underline,
                    ))
              ],
            )
          ],
        ),
      ),
    );
  }

  _sendCode() async {
    RegExp reg = new RegExp(r"^1\d{10}$");
    var api = Config.domain + 'api/sendCode';
    if (reg.hasMatch(this.tel)) {
      var response = await Dio().post(api,data:{"tel":this.tel});
      var res = response.data;

      // 服务器验证手机号码没有注册等等
      if (res['success']){
        print(res);
        // 跳转到下一页
        Navigator.pushNamed(context, '/registerSecond', arguments: {"tel": tel});

      }else{   // 服务器验证手机号码已注册等等
        // 弹框提示
        Fluttertoast.showToast(
          msg: "${res['message']}",
          toastLength: Toast.LENGTH_SHORT,
          gravity: ToastGravity.CENTER,
        );
      }
    } else {
      // 弹框提示
      Fluttertoast.showToast(
        msg: "手机号码格式不正确，请重新输入",
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
      );
    }
  }
}
